import React, { Component } from 'react';
import { Modal, Form, Switch, InputNumber, Checkbox } from "antd";
import constant from "../loan-setting/constant";
import { messages } from "share/common";
import WrapFormItem from "components/wrap-form-item";
import Chooser from "components/chooser";

class LoanMaxModal extends Component {

  componentWillReceiveProps(nextProps) {
    if (!nextProps.visible || nextProps.visible === this.props.visible) {
      return -1;
    }
    this.props.form.resetFields();
  }

  onOk = () => {
    this.props.form.validateFieldsAndScroll((err, value) => {
      if (!err) {
        const { record, onOk } = this.props;
        let temp = value.user;
        value.userGroups = temp.userGroups;
        value.userIds = temp.userIds;
        delete value.user;
        onOk(Object.assign(record, value));
      }
    })
  };

  render() {
    const { cancel, visible, record, setOfBooksId } = this.props;
    const { getFieldDecorator } = this.props.form;
    const { formItemLayout } = constant;
    let type = [];
    record.userIds && record.userIds.length > 0 && type.push('userId');
    record.userGroups && record.userGroups.length > 0 && type.push('userGroup');
    return (
      <Modal
        visible={visible}
        onCancel={cancel}
        onOk={this.onOk}
        title={messages('basic-5.key129')/*借款上限*/}
      >
        <Form className='new-form'>
          <Form.Item
            label={messages('common.column.status')/*状态*/}
            {...formItemLayout}
          >
            {getFieldDecorator("enabled", {
              rules: [{ required: true }],
              valuePropName: "checked",
              initialValue: record.hasOwnProperty('enabled') ? record.enabled : true
            })(
              <Switch>{messages('basic-5.key20')/*启用temp*/}</Switch>
            )}
          </Form.Item>
          <Form.Item
            label={messages('basic-5.key130')/*金额上限*/}
            {...formItemLayout}
            extra={messages('basic-5.key131')/*上限金额币种为账套本位币*/}
          >
            {getFieldDecorator('amountMax',{
              rules: [{ required: true, message: messages('basic-5.key132')/*请输入最大上限总金额*/ }],
              initialValue: record.amountMax ? record.amountMax : undefined
            })(
              <InputNumber min={0} precision={2} step={1} style={{width:'100%'}} placeholder={messages('common.please.input')/*请输入*/}/>
            )}
          </Form.Item>
          <Form.Item
            label={'适用人员'}
            {...formItemLayout}
          >
            {getFieldDecorator('user',{
              rules: [{ required: true, message: messages('common.select')/*请选择*/ }],
              initialValue: record.amountMax ? {
                userIds: record.userIds,
                userGroups: record.userGroups,
                type: type
              } : undefined
            })(
              <WrapFormItem parser={value => value || {}}>
                {(onChange, value) => (
                  <div>
                    <Checkbox.Group
                      onChange={value => onChange({ type: value, userIds: [], userGroup: [] })}
                      value={value.type}
                    >
                      <Checkbox value={'userId'}>{messages('basic-5.key133')/*人员分配*/}</Checkbox>
                      <Checkbox value={'userGroup'}>{messages('basic-5.key134')/*人员组分配*/}</Checkbox>
                    </Checkbox.Group>
                    {
                      value.type && value.type.indexOf('userId') > -1 && (
                        <Chooser
                          type="loan-max-users"
                          listExtraParams={{ setOfBooksId }}
                          value={value.userIds ? value.userIds.map(item => { return { id: item, fullName: '' } }) : []}
                          showNumber
                          labelKey='fullName'
                          valueKey='id'
                          showDetail={false}
                          onChange={value => onChange({ userIds: value ? value.map(item => item.id) : [] })}
                        />
                      )
                    }
                    {
                      value.type && value.type.indexOf('userGroup') > -1 && (
                        <Chooser
                          type='support_failure_user_group'
                          listExtraParams={{
                            levelCode: 'SET_OF_BOOK',
                            levelOrgId: setOfBooksId
                          }}
                          showDetail={false}
                          value={value.userGroups ? value.userGroups.map(item => { return { id: item, name: '' } }) : []}
                          showNumber
                          labelKey='name'
                          valueKey='id'
                          onChange={value => onChange({ userGroups: value ? value.map(item => item.id) : []})}
                        />
                      )
                    }
                  </div>
                )}
              </WrapFormItem>
            )}
          </Form.Item>
        </Form>
      </Modal>
    )
  }

}

export default Form.create()(LoanMaxModal)
